#@Author: bjy @Date: 2019/4/17 15:57 @Version 1.0#
<template>
  <div class="activityWonderful">
    <div style="background: #fffcfa; padding-bottom: 10px;">
      <!-- 页面标题 -->
      <div class="activityWonderful-left-title">
        <h2>{{pageTitle}}</h2>
      </div>
      <div class="activity-title-line"></div>
      <!-- 页面按钮 -->
      <div class="button-input">
        <div class="activity-div-button">
          <el-button type="primary" plain  class="activity-button" @click="addReview">新增回顾</el-button>
          <el-button type="primary" plain  class="activity-button" @click="editorialPublished">编辑发布</el-button>
          <el-button type="primary" plain  class="activity-button" @click="cancelPublished">取消发布</el-button>
          <el-button type="primary" plain  class="activity-button" @click="deleteThisActivityAct">删除回顾</el-button>
        </div>
        <div class="input-search">
          <el-input style="width:20%;" v-model="searchValue" placeholder="活动名称搜索" @input="changeInputByActivityTitle">
            <i slot="prefix" class="el-input__icon el-icon-search"></i>
          </el-input>
        </div>
      </div>
      <!-- table表格 -->
      <div class="activity-table">
        <ActivityWonderfulTable :tableDataList="tableData" @changeData="changeTableData" :loadingBoolean="loadingBoolean"></ActivityWonderfulTable>
      </div>
      <!-- 分页 -->
      <div style="width: 100%;text-align: center; margin: 5px auto ">
        <el-pagination
          background
          layout="prev, pager, next"
          :page-size="pageSize"
          :total="total"
          @current-change="handleCurrentChange">
        </el-pagination>
      </div>
      <!--历史活动列表-->
      <div>
        <el-dialog title="历史活动列表" :visible.sync="dialogReviewActivityTableVisible" :before-close="closeReviewActivityDialog" width="80%">
          <div class="activity-div-button">
            <el-button type="primary" plain  class="activity-button" @click="addReviewThisActivity">新增回顾</el-button>
          </div>
          <!--列表-->
          <div>
            <el-table :data="tableDataReviewActivity" highlight-current-row @current-change="handleTableChangeReviewActivity" ref="singleTable"
                      border style="width: 98%;margin:0 1%" height="600">
              <el-table-column prop="real_name" label="活动发起支部" width="180"></el-table-column>
              <el-table-column prop="activitytitle" label="活动名称" width="180"></el-table-column>
              <el-table-column prop="categoryintegral" label="活动签到积分"></el-table-column>
              <el-table-column prop="activitystarttime" label="活动开始时间"></el-table-column>
              <el-table-column prop="activityendtime" label="活动结束时间"></el-table-column>
              <el-table-column prop="activitysitename" label="活动地点"></el-table-column>
              <el-table-column prop="activitynumber" label="面向人数"></el-table-column>
              <el-table-column prop="categoryname" label="活动类型"></el-table-column>
              <el-table-column prop="activitystatus" label="活动状态"></el-table-column>
            </el-table>
          </div>
          <!--分页-->
          <div style="width: 100%;text-align: center; margin: 5px auto ">
            <el-pagination
              background
              layout="prev, pager, next"
              :page-size="pageSize"
              :total="ReviewActivityTotal"
              @current-change="handleReviewActivityCurrentChange">
            </el-pagination>
          </div>
        </el-dialog>
      </div>
      <!--新增回顾添加页面-->
      <div>
        <el-dialog
          width="50%"
          title="新增回顾"
          :visible.sync="addReleaseActivityVisible"
          append-to-body :before-close="closeInnerReviewActivityDialog">
          <el-form :model="addReleaseActivityForm" ref="addReleaseActivityForm">
            <tr>
              <td colspan="2">
                <el-form-item label="活动地点" :label-width="formLabelWidth" prop="activityAddress">
                  <el-input v-model="addReleaseActivityForm.activitysitename" autocomplete="off"></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td colspan="2">
                <el-form-item label="活动标题名称" :label-width="formLabelWidth" prop="activitytitle">
                  <el-input v-model="addReleaseActivityForm.activitytitle" autocomplete="off"></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="活动开始时间" :label-width="formLabelWidth" prop="activitystarttime">
                  <el-input v-model="addReleaseActivityForm.activitystarttime" autocomplete="off" readonly style="width: 65%"></el-input>
                </el-form-item>
              </td>
              <td>
                <el-form-item label="活动结束时间" :label-width="formLabelWidth" prop="activityendtime">
                  <el-input v-model="addReleaseActivityForm.activityendtime" autocomplete="off" readonly style="width: 65%"></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="所属支部/党委" :label-width="formLabelWidth" prop="real_name">
                  <el-input v-model="addReleaseActivityForm.real_name" autocomplete="off" style="width: 65%;" readonly></el-input>
                </el-form-item>
              </td>
              <td>
                <el-form-item label="活动类型" :label-width="formLabelWidth" prop="categoryname">
                  <el-input v-model="addReleaseActivityForm.categoryname" autocomplete="off" style="width: 65%;" readonly></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td colspan="2">
                <el-form-item label="选择该活动图片" :label-width="formLabelWidth" >
                  <el-button type="primary" plain  class="activity-button" @click="changeAddReviewThisActivityImage">选择图片</el-button>
                </el-form-item>
              </td>
              <!-- 保存原有的活动id -->
              <td>
                <el-form-item label="活动id" :label-width="formLabelWidth" prop="activitynumber" style="display: none;">
                  <el-input v-model="addReleaseActivityForm.activitynumber" autocomplete="off" style="width: 65%;" readonly></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td colspan="2">
                <NavUeditor :config=ueConfig id="activityWonderfulUeditor" ref="activityWonderfulUeditor"></NavUeditor>
              </td>
            </tr>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="goBack()">返 回</el-button>
            <el-button @click="closeInnerReviewActivityDialog()">取 消</el-button>
            <el-button type="primary" @click="formSubmintAddActivityWonderful()">确 定</el-button>
          </div>
          <!-- 新增回顾的选择图片按钮 -->
          <el-dialog
            width="40%"
            title="选择图片"
            :visible.sync="innerAddActivityWonderfulChangeImagesVisible"
            :before-close="closeAddActivityWonderfulImages"
            append-to-body>
            <div>
              <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
              <div style="margin: 15px 0;" class="changeActivityImages">
                <el-checkbox-group v-model="checkedImages" @change="handleCheckedImagesChange">
                  <el-checkbox v-for="image in imagesActivityWonderful" :label="imageUrl" :key="imageUrl" class="changeImages-checkbox">
                    <template>
                      <div class="block">
                        <el-image
                          style="width: 100px; height: 100px"
                          :src="imageUrl"
                          fit=" cover"></el-image>
                      </div>
                    </template>
                  </el-checkbox>
                </el-checkbox-group>
              </div>
            </div>
            <div slot="footer" class="dialog-footer">
              <el-button @click="innerAddActivityWonderfulChangeImagesVisible = false">取 消</el-button>
              <el-button type="primary" @click="changeAddActivityWonderfulImages()">确 定</el-button>
            </div>
          </el-dialog>
        </el-dialog>
      </div>
      <!--编辑发布弹窗-->
      <div>
        <el-dialog title="编辑发布" :visible.sync="dialogHistoricalActivityFormVisible" :before-close="closeUpdateActivityWonderfulDialog">
          <el-form :model="historicalActivityForm" ref="updateActivityWonderfulForm">
            <tr>
              <td colspan="2">
                <el-form-item label="活动地点" :label-width="formLabelWidth" prop="activitysitename">
                  <el-input v-model="historicalActivityForm.activitysitename" autocomplete="off"></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td colspan="2">
                <el-form-item label="活动名称" :label-width="formLabelWidth" prop="activitytitle">
                  <el-input v-model="historicalActivityForm.activitytitle" autocomplete="off"></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="活动开始时间" :label-width="formLabelWidth" prop="activitystarttime">
                  <el-input readonly v-model="historicalActivityForm.activitystarttime" style="width:65%;" autocomplete="off"></el-input>
                </el-form-item>
              </td>
              <td>
                <el-form-item label="所属支部/党委" :label-width="formLabelWidth" prop="organization">
                  <el-input readonly v-model="historicalActivityForm.real_name" style="width:65%;" autocomplete="off"></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="活动结束时间" :label-width="formLabelWidth" prop="activityendtime">
                  <el-input readonly v-model="historicalActivityForm.activityendtime" style="width:65%;" autocomplete="off"></el-input>
                </el-form-item>
              </td>
              <td>
                <el-form-item label="活动类型" :label-width="formLabelWidth" prop="=categoryname">
                  <el-input v-model="historicalActivityForm.categoryname" style="width: 65%;" readonly></el-input>
                </el-form-item>
              </td>
            </tr>
            <tr>
              <td colspan="2">
                <NavUeditor :config=ueConfig id="updateActivityWonderfulUeditor" ref="updateActivityWonderfulUeditor"></NavUeditor>
              </td>
            </tr>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="dialogHistoricalActivityFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="dialogUpdateActivityWonderfulSubmit">确 定</el-button>
          </div>
        </el-dialog>
      </div>
    </div>
  </div>
</template>

<script>
  import NavUeditor from '../../NavUeditor/NavUeditor.vue'
  import ElButton from "../../../../../node_modules/element-ui/packages/button/src/button";
  import ActivityWonderfulTable from "../ActivityWonderful/activityWonderfulList.vue"
  import util from "../../../../Js/utils.js"
  import ElInput from "../../../../../node_modules/element-ui/packages/input/src/input";
  //  此处导入组件,格式,例如:import xxx名称 from "路径"
  export default{
    // 这里是name,记得填写
    name: 'activityWonderful',
    //  数据定义
    data () {
      return {
        //多选框demo
        checkAll: false,// 是否全选
        checkedImages: [],// 用户选择的图片数组
        imagesActivityWonderful: [],// 后台循环出来的该活动的图片数组,
        isIndeterminate: true,
        searchValue:null,
//            当前页
        currentPage: 1,
//              新增回顾的当前页面
        ReviewActivityCurrentPage:1,
//            每页显示几条
        pageSize: 10,
//            总条目数
        total: 0,
//              新增回顾分页
        ReviewActivityTotal:0,
//                活动标题
        pageTitle: '活动管理-精彩回顾',
//              表格数据
        tableData: [],
//              加载框
        loadingBoolean:false,
//              新增发布的活动
        tableDataReviewActivity:[],
//            表格选中的数据
        tableDataChecked: null,
//              新增回顾列表选中数据
        ReviewActivityTableDataChecked:null,
//              新增回顾选择图片弹窗
        innerAddActivityWonderfulChangeImagesVisible: false,
//              新增页面
        addReleaseActivityForm:{
          activitytitle: null,// 活动名称
          activitycontent:null,// 活动内容
          activitysitename: null,// 活动地点名称
          activitysignstarttime:null,//允许签到的最早时间
          activitysignendtime:null,// 允许签到的最晚时间
          activitystarttime:null,// 活动开始时间
          activityendtime:null,// 活动结束时间
          activityid:null,// 活动类型id
          activitydigest:null,// 活动摘要
          activityimg:null,// 活动展示图
          activitynumber:null,// 活动人数
          organizationid:null,// 组织Id
          activityintegral:0,// 活动积分
          activitylongitude:0,// 经度
          activitylatitude:0// 纬度
        },
//              定时器
        addReviewSetTimeOut:null,
//              编辑发布所需要的数据
        formLabelWidth: '120px',
        historicalActivityForm:{
          activityAddress:'',
          activityTitle: '',
          activityStartTime: '',
          activityEndTime: '',
          organization: '',
          activityType: '',
          activityId: '',
          activityContent: ''
        },
//              弹窗显示
        dialogHistoricalActivityFormVisible:false,
//              新增回顾列表
        dialogReviewActivityTableVisible:false,
//              新增回顾页面
        addReleaseActivityVisible:false,
//             弹窗所属组织下拉设定
        optionsOrganizationArr:[
          {value:'镇党委',label:'镇党委'},
          {value:'光辉村支部',label:'光辉村支部'}
        ],
//              活动类型下拉设定
        activityTypeArr:[
          {value:'主题党日',label:'主题党日'},
          {value:'志愿者活动',label:'志愿者活动'}
        ],
//              富文本编辑器配置
        ueConfig: {
          //可以在此处定义工具栏的内容
          toolbars: [[
            'fullscreen',  '|', 'undo', 'redo', '|',
            'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
            'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
            'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
            'directionalityltr', 'directionalityrtl', 'indent', '|',
            'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
            'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
            'simpleupload', 'insertimage', 'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'insertframe',  'webapp', 'pagebreak', 'template', 'background', '|',
            'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
            'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
            'print', 'preview', 'searchreplace', 'help', 'drafts'
          ]],
          zIndex:3000,
          elementPathEnabled : false,// 隐藏下方的元素路径
          autoHeightEnabled: false,
          autoFloatEnabled: true,
          initialContent:'请输入内容',   //初始化编辑器的内容,也可以通过textarea/script给值，看官网例子
          autoClearinitialContent:true, //是否自动清除编辑器初始内容，注意：如果focus属性设置为true,这个也为真，那么编辑器一上来就会触发导致初始化的内容看不到了
          initialFrameWidth: null,
          initialFrameHeight: 300,
          BaseUrl: '',
          UEDITOR_HOME_URL: 'static/ueditor/',
        },
      }

    },
    // 页面加载
    created(){
      // 查询展示的精彩回顾
      this.selectShowHistoryActivityList(1)
    },
    // 页面方法
    methods: {
      // 全选
      handleCheckAllChange(val) {
        this.checkedImages = val ? this.imagesActivityWonderful : [];
        this.isIndeterminate = false;
      },
      // checkbox选中事件
      handleCheckedImagesChange(value) {
        let checkedCount = value.length;
        this.checkAll = checkedCount === this.imagesActivityWonderful.length;
        this.isIndeterminate = checkedCount > 0 && checkedCount < this.imagesActivityWonderful.length;
      },
      // 查询所有的精彩回顾
      selectShowHistoryActivityList(pageNum){
        this.loadingBoolean = true;
        this.$http.post(
          this.$BASE_URL+'activity/selectalllookback',
          {pageNum:pageNum,pageSize:this.pageSize}
        ).then(res=>{
          let list = res.data.list;
          for(let i = 0; i < list.length; i++){
            if(list[i].activityflag === 0){
              list[i]['activitystatus'] = '展示中'
            }else if(list[i].activityflag === 1){
              list[i]['activitystatus'] = '已下架'
            }
          }
          this.tableData = list;
          this.total = res.data.total;
          this.loadingBoolean = false;
        },res => {
          this.loadingBoolean = false;
          console.error(res)
        })
      },
      // 查询所有审核过的活动
      selectActivityWonderfulListByOidLimit(pageNum){
        let _this = this;
        this.currentPage = pageNum
        this.$http.post(
          this.$BASE_URL+'activity/selectallby',
          {pageNum:pageNum,pageSize:this.pageSize},{emulateJSON:false}
        ).then(res => {
          let isList = res.data.list;
          for(let i = 0;i <isList.length;i++){
            if (isList[i].activityflag === 1){
              isList[i]['activitystatus'] = '审核通过'
            }
          }
          this.tableDataReviewActivity = isList;
          this.ReviewActivityTotal = res.data.total;
        },res => {

        })
      },
      // 新增回顾
      addReview(){
        this.dialogReviewActivityTableVisible = true;
        this.selectActivityWonderfulListByOidLimit(this.ReviewActivityCurrentPage,1)
      },
//          新增发布窗口关闭
      closeReviewActivityDialog(done){
        this.dialogReviewActivityTableVisible = false
      },
      closeInnerReviewActivityDialog(){
        this.$confirm('确认是否关闭？页面上的数据将不会被保留')
          .then(_ => {
            this.addReleaseActivityVisible = false
            done();
          })
          .catch(_ => {});
      },
      // 新增回顾页面提交
      formSubmintAddActivityWonderful(){
        let reqData = this.addReleaseActivityForm;
        delete reqData.real_name;
        delete reqData.categoryname;
        delete reqData.id;
        let contentHtml = this.$refs.activityWonderfulUeditor.getUEContent();
        let firstImage = util.getFirstImageByContentHtml(contentHtml);
        let content = this.$refs.activityWonderfulUeditor.getContentTxt();
        reqData.activitycontent = contentHtml;
        reqData.activityimg = firstImage;
        reqData.activitydigest = content;
        this.$http.post(
          this.$BASE_URL+'activity/insertlookback',
          (reqData),{emulateJSON:true}
        ).then( res => {
          let resCode = res.data.code;
          if(resCode === 200) {
            this.$message.success('新增回顾' + res.data.resMessage);
            this.addReleaseActivityVisible = false;
            this.$refs.activityWonderfulUeditor.setUEContent('<p></p>');
          }else {
            this.$message.error(res.data.message)
          }
        },res => {
          console.error(res)
        });

      },
      // 新增回顾按钮
      addReviewThisActivity(){
        if(!this.ReviewActivityTableDataChecked){
          this.$message.error('错误操作, 请选择一条数据在进行操作');
          return;
        }
        let checkedThisActivity = this.ReviewActivityTableDataChecked;
        this.addReleaseActivityForm.activitysitename = checkedThisActivity.activitysitename;
        this.addReleaseActivityForm.activitytitle = checkedThisActivity.activitytitle;
        this.addReleaseActivityForm.activitystarttime = checkedThisActivity.activitystarttime;
        this.addReleaseActivityForm.activityendtime = checkedThisActivity.activityendtime;
        this.addReleaseActivityForm.id = checkedThisActivity.id;
        this.addReleaseActivityForm.real_name = checkedThisActivity.real_name;
        this.addReleaseActivityForm.categoryname = checkedThisActivity.categoryname;
        this.addReleaseActivityForm.activityid = checkedThisActivity.activityid;

        this.dialogReviewActivityTableVisible = false;
        this.addReviewSetTimeOut =  setTimeout(()=>{
          this.addReleaseActivityVisible = true;
          clearTimeout(this.addReviewSetTimeOut)
        },500);
      },
      // 新增回顾页面
      goBack(){
        this.addReleaseActivityVisible = false;
        this.addReviewSetTimeOut =  setTimeout(()=>{
          this.dialogReviewActivityTableVisible = true;
          clearTimeout(this.addReviewSetTimeOut)
        },500);
      },
      // 新增回顾页面的选择图片素材按钮
      changeAddReviewThisActivityImage(){
        let params = {
          id:Number(this.addReleaseActivityForm.id)
        };
        this.$http.post(
          this.$BASE_URL+'activity/selectallimage',
          (params),{emulateJSON:false}
        ).then(res => {
          let resCode = res.data.code;
          if (resCode === 200){
            let resOutput = res.data.output;
            this.imagesActivityWonderful = resOutput.imgUrl;
            this.innerAddActivityWonderfulChangeImagesVisible = true;
          }else{
            this.$message.error('获取图片失败')
          }
        },res => {
          console.error(res)
        });

      },
      // 新增回顾选择图片弹窗关闭
      closeAddActivityWonderfulImages(done){
        this.$confirm('确认是否关闭？')
          .then(_ => {
            this.$refs.form.resetFields();
            this.dialogHistoricalActivityFormVisible = false
            done();
          })
          .catch(_ => {});
      },
      // 新增回顾选择图片弹窗图片选择完毕确定
      changeAddActivityWonderfulImages(){
        this.innerAddActivityWonderfulChangeImagesVisible = false;
        // 获得用户选择图片数组
        let userCheckedImages = this.checkedImages;
        if(userCheckedImages.length <= 0){
          return;
        }
        let contentHtml = this.$refs.activityWonderfulUeditor.getUEContent();
        let imgHtml;
        for(let i= 0; i < userCheckedImages.length; i++){
          imgHtml += '<img src="'+userCheckedImages[i]+'"></img>'
        }
        this.$refs.activityWonderfulUeditor.setUEContent(contentHtml+imgHtml);

      },
      // 新增发布窗口 选中数据
      handleTableChangeReviewActivity(e){
        this.ReviewActivityTableDataChecked = e
      },
//          新增发布窗口分页
      handleReviewActivityCurrentChange(pageNum){
        this.selectActivityWonderfulListByOidLimit(pageNum)
      },
//            选中表格中的数据
      changeTableData(e){
        this.tableDataChecked = e
      },
//          页面分页
      handleCurrentChange(pageNum){
        this.selectShowHistoryActivityList(pageNum)
      },
//          编辑发布
      editorialPublished(){
        if(!this.tableDataChecked){// 没有选中数据
          this.$notify.error({
            title: '操作错误',
            message: '请先选择一条数据,再进行编辑发布'
          });
          return;
        }
        this.$http.post(
          this.$BASE_URL+'activity/selectlookbackbyid',
          {id:Number(this.tableDataChecked.id)},{emulateJSON:false}
        ).then(res => {
          let resCode = res.data.code;
          if(resCode === 200){
            let output = res.data.output;
            this.historicalActivityForm = output;
            // 时间格式转换
            this.historicalActivityForm.activitystarttime = util.formatTime(this.historicalActivityForm.activitystarttime);
            this.historicalActivityForm.activityendtime = util.formatTime(this.historicalActivityForm.activityendtime);
            this.historicalActivityForm.real_name = this.tableDataChecked.real_name;
            this.historicalActivityForm.categoryname = this.tableDataChecked.categoryname;
            this.dialogHistoricalActivityFormVisible = true;
            this.setTimeout = setTimeout(()=>{
              this.$refs.updateActivityWonderfulUeditor.setUEContent(output.activitycontent);
              clearTimeout(this.setTimeout)
            },500);
          }else{
            this.$message.error('获取数据失败')
          }
        },res =>{
          console.error(res)
        })
      },
      // 删除精彩回顾
      deleteThisActivityAct(){
        if(!this.tableDataChecked){// 没有选中数据
          this.$notify.error({
            title: '操作错误',
            message: '请先选择一条数据,再进行删除'
          });
          return;
        }
        if(this.tableDataChecked.activityflag === 0){
          this.$notify.error({
            title: '操作错误',
            message: '该数据是展示状态,请先下架后再进行删除'
          });
          return;
        }
        this.$confirm('此操作不可逆转,是否继续删除该精彩回顾?', '警告', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'error'
        }).then(() => {// 点击确定
          this.$http.post(// 精彩回顾取消发布
            this.$BASE_URL+'activity/deletelookback',
            {id:Number(this.tableDataChecked.id)},{emulateJSON:false}
          ).then(res => {
            let resCode = res.data.code;
            if(resCode === 200){
              this.$message.success('删除'+res.data.resMessage);
              this.selectShowHistoryActivityList( this.currentPage);
            }
          },res => {
            this.$message.error(res.data.resMessage)
          });
        }).catch(() => {// 点击取消

        });
      },
//          取消发布
      cancelPublished(){
        if(!this.tableDataChecked){// 没有选中数据
          this.$notify.error({
            title: '操作错误',
            message: '请先选择一条数据,再进行取消发布'
          });
          return;
        }
        if(this.tableDataChecked.activityflag === 1){
          this.$notify.error({
            title: '操作错误',
            message: '该数据已是下架状态,请勿重复操作'
          });
          return;
        }
//              询问框
        this.$confirm('此操作将让该活动恢复到下架状态,是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {// 点击确定
          this.$http.post(// 精彩回顾取消发布
            this.$BASE_URL+'activity/updatelookback',
            {id:Number(this.tableDataChecked.id)},{emulateJSON:false}
          ).then(res => {
            let resCode = res.data.code;
            if(resCode === 200){
              this.$message.success(res.data.resMessage);
              this.selectShowHistoryActivityList( this.currentPage);
            }
          },res => {
            this.$message.error(res.data.resMessage)
          });
        }).catch(() => {// 点击取消

        });
      },
//          编辑发布弹窗关闭
      closeUpdateActivityWonderfulDialog(done){
        this.$confirm('确认是否关闭？页面上的数据将不会被保留')
          .then(_ => {
            this.$refs.updateActivityWonderfulForm.resetFields();
            this.dialogHistoricalActivityFormVisible = false
            done();
          })
          .catch(_ => {});
      },
//          编辑发布确认提交
      dialogUpdateActivityWonderfulSubmit(){
        // 获取富文本内容
        let contentHtml = this.$refs.updateActivityWonderfulUeditor.getUEContent();
        let firstImage = util.getFirstImageByContentHtml(contentHtml);
        let content = this.$refs.updateActivityWonderfulUeditor.getContentTxt();
        let reqData = this.historicalActivityForm;
        reqData.activityimg = firstImage;
        reqData.activitycontent = contentHtml;
        reqData.activitydigest = content;
        delete reqData.real_name;
        delete reqData.categoryname;
        this.$http.post(
          this.$BASE_URL+'activity/updateactivitylookback',
          (reqData),{emulateJSON:true}
        ).then(res => {
          let resCode = res.data.code;
          if(resCode === 200){
            this.$message.success(res.data.resMessage);
            this.dialogHistoricalActivityFormVisible = false
            this.selectShowHistoryActivityList( this.currentPage)
          }else{
            this.$message.error('修改失败')
          }
        },res => {
          console.error(res)
        });
        this.dialogHistoricalActivityFormVisible = false;
        // 恢复富文本初始化状态
        this.$refs.updateActivityWonderfulUeditor.setUEContent('<p>请输入内容</p>');
      },
//          历史活动查询
      changeInputByActivityTitle(searchValue){
        this.loadingBoolean = true;
        this.$http.post(
          this.$BASE_URL+'activity/selectlookbackbylikeandsid',
          {pageNum:1,pageSize:100000,activityTitle:searchValue},
          {emulateJSON:false}
        ).then(res => {
          let list = res.data.list;
          for(let i = 0; i < list.length; i++){
            if(list[i].activityflag === 0){
              list[i]['activitystatus'] = '展示中'
            }else if(list[i].activityflag === 1){
              list[i]['activitystatus'] = '已下架'
            }
          }
          this.tableData = list;
          this.loadingBoolean = false;
        },res => {
          console.error(res)
        })
      },
    },

    // 计算属性
    computed: {},
    // 侦听器
    watch: {},
    // 依赖注入
    components: {
      ElInput,
      ElButton,NavUeditor,ActivityWonderfulTable
    }
  }
</script>

<!-- 本地样式 -->
<style scoped>
  .activityWonderful{
    width: 100%;
    height: 100%;
    background-color: #fffcfa;
  }

  .activityWonderful-left-title{
    text-align: left;
    padding: 10px 20px;
  }
  .activity-title-line{
    height:1px;
    width: 98%;
    margin: auto 1%;
    background-color: #ddd;
  }
  .activity-div-button{
    text-align: left;
    width:70%;
    margin: 10px auto;
    background-color: #ffffff;
  }
  .activity-button{
    margin: 0 20px;
  }
  .activity-table{
    text-align: center;
    width:100%;
    display: flex;;
    justify-content: center;
    align-content: center;
  }
  .changeActivityImages{
    margin: 5px;
    display: flex;
    align-content: center;
    justify-content: center;
    flex-direction:row;/* 横向排列 */
    flex-wrap:wrap;/* wrap：flex容器为多行。就是换行的意思 */
  }
  .changeImages-checkbox{
    margin:10px;
  }
  .button-input{
    display: flex;
  }
  .input-search{
    width: 60%;
    text-align: center;
    margin: 10px 0;
  }
</style>
